@charset "utf-8";

@import url('common/common.less');

.container{ 
  background-color: @cf;
}

  #banner{
    .bannerImg{width:100%}
  }
  //留言模块
  #leaving{
    margin-top:2rem;
    .leaving-main{
      height:3rem;
      margin:0 auto;
      width:25rem;
      text-align: center;
      .leaving-mes{
        height:100%;
        width:18rem;
        padding:0 .7rem;
        border:1px solid @cdb;
        border-radius:1.5rem;
      }
      .call{
        height:3rem;
        width:3rem;
        border-radius: 1.5rem;
        background-color:@ba;
        line-height: 3rem;
      }
      a{color:@cf;}
    }
  }

  //资料信息模块
  #main-sign{
    position: relative;
    z-index: 3;
    margin-top: -1rem;
    &>ul{
      .head-img{
        width:6.2rem;
        height:6.2rem;
        border-radius:3.1rem;
        box-shadow:0px 0px 0px 3px @cf;
      }
      .sign-top{
        position: relative;
        margin-top:1.5rem;
        margin-left: 1rem;

        .sign-text{
          position: relative;
          margin-top: .5rem;
          width:15rem;
          height:1.5rem;
          -webkit-perspective: 30rem;

          .li-text{
            position: absolute;
            top:0;
            left:0;
            width:100%;
            height:1.5rem;

            transform-origin:center center;
            backface-visibility:hidden;
            -webkit-backface-visibility:hidden;	/* Chrome 和 Safari */

            &:first-child{
              animation: topText 3s infinite alternate linear;
            }
            &:last-child{
              animation: bottomText 3s infinite alternate linear;
            }
            
          }
          
          @keyframes topText {
            0% {
              transform:rotateX(0deg);
            }
            45% {
              transform:rotateX(0deg);
            }
            55% {
              transform:rotateX(180deg);
            }
            100% {
              transform:rotateX(180deg);
            }
          }

          @keyframes bottomText {
            0% {
              transform:rotateX(-180deg);
            }
            45% {
              transform:rotateX(-180deg);
            }
            55% {
              transform:rotateX(0deg);
            }
            100% {
              transform:rotateX(0deg);
            }
          }
          
        }
      }

    }
  }

  //计数模块
  #count{
    padding:.7rem 0;
    text-align: center;
    margin-top:2rem;
    border-top: 1px solid @ceb;
    border-bottom: 1px solid @ceb;
    background-color:@cf9;
  }

  //更多
  .more{
      width:4px;
      height:4px;
      border-radius:2px;
      background-color:@cc;
  }

  //图片模块列
  #latest{
    padding:1rem 0 1.3rem;

    .latest-item{
      margin:1rem auto 0;
      width:90%;
      .list-box{
        width:23%;
        overflow:hidden;
        background-size:cover;
        background-position:top center;
      }
    }

    .poss-more{
      width:18px;
      float: right;
    }
  }

  #app-down{
    //background-color:#f9f9f9;
    padding:0.5rem 0;
    height:5rem;
    .down{
      width:70%;
      height:3rem;
      line-height: 3rem;
      margin-left: 0.5rem;
      border-radius: 5px;
      color:@c6;
      text-align: center;
      //background: linear-gradient(to bottom, #fbfbfb, @cf2); /* 标准的语法 */
      border: 1px solid @cf2;
    }
  }

  //首页文章
  #main-article{
    .art{
      margin-bottom:1.5rem;
      text-align: center;
      .img-box{
        height:15rem;
      }
      //文章标题
      //文章内容
      .art-text{
        width:85%;
        margin:1rem auto 0;
        line-height: 1.8rem;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
      }
      //查看按钮
      .checked{
        height:2.5rem;
        width:8rem;
        border-radius: 5px;
        line-height: 2.5rem;
        margin:1.5rem auto 0;
        background-color: @ba;
        color:@cf;
      }
      //列表列排
      .pos-more{
        position: absolute;
        left:95%;
        margin-left: -4px;
        height:18px;
        margin-top:.5rem;
      }
    }

  }
























